/*
  学习目标：准备静态结构和拆分组件
  步骤：
     1. 静态CV
     2. 拆分组件
        选中代码 - 重构 - module范围中的function
      *  2.1 选中要重构的代码，右键 - 重构 - move to a new file
      *  2.2 可以再重构成默认导出
      *  2.3 路径也想改
*/
/*
  学习目标：设计Redux仓库，能够获取数据
  步骤：
     1. 拆分reducer： 按功能模块拆分， 
        src/store/reducer/channel.js  src/store/reducer/news.js
     2. 合并reduder:  src/reducer/index.js
     3. src/store/index.js 创建store,  配置调试工具和中间件
     4. react-redux库连接redux 和react - Provider组件设置store属性
     5. 获取数据useSelector
*/

/*
  学习目标：使用redux-thunk发送请求，获取频道的列表数据
  步骤：
     1. 封装API  src/api/channel.js
     2. 封装异步action(返回函数是异步)  src/action/channel.js
     3. 挂载后，使用dispatch触发异步，开始发请求
*/

/*
  学习目标：数据存入redux中
  1. 定义actionTypes中的常量
  2. dispatch触发action - 不用再封装 actionCreator，因为action 已经在action文件夹中
  3. reducer中完成保存的计算
*/

/*
  学习目标：从Redux中获取数据，渲染列表和类名
    1. useSelector 获取 channelList，渲染列表
    2. 设置当前选中id，绑定类名 （点击切换高亮等会完成）
*/
/*
  学习目标：点谁谁高亮
    1. actionType中定义常量
    2. 封装一个更新的action
    3. onClick事件触发dispatch, 传参id
    4. 完成更新currentId的计算
*/
/*
  学习目标：根据频道id，请求对应的文章列表数据
  步骤：
     1. 封装API     src/api/news.js
     2. 封装异步Action(返回函数是异步)  src/action/news.js
     3. 挂载后方法请求，依赖项添加 当前id
*/

/*
  学习目标：将文章列表数据，存入redux中
    1. actionType中定义常量
    2. dispatch触发action 
        dispatch({ type: NEWS_SAVE_LIST, payload: res.data.results })
    3. reducer中完成保存数据的计算
*/
/*
  学习目标：取出数据，渲染新闻列表
    1. useSelector 获取 newsList
    2. 列表渲染
        注意默认图片要 import 引进
*/
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import App from './App';
import store from './store';
import './styles/base.css';
import './styles/index.css';

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById('root')
);
